/**
 * @ProjectName： naive-admin
 * @FileName： menu-state.ts
 * @Description: // 存放菜单数据状态
 * @Author: ellwood
 * @date: 2024/2/4 - 7:47
 * @Version: V1.0.0
 */
function menuStateFn() {
  const route = useRoute()

  // 定义类型
  const state = reactive({
    active: '',
  })

  // 创建更新方法
  const updateActive = (active: string) => {
    state.active = active
  }

  watch(
    () => route.fullPath,
    () => {
      updateActive(route.fullPath)
    },
  )

  return { ...toRefs(state), updateActive }
}

//  创建依赖注入，这个方法返回的是一个数组，一个是注入函数，第二个是获取注入数据的函数，
const [useMenuStateProvider, useMenuStateInject]
    = createInjectionState(menuStateFn)

export { useMenuStateProvider }

// 由于第二个注入函数可能是一个undefined，所以我们再进行一次封装保证百分百能拿到值。
export function useMenuState() {
  return (
    useMenuStateInject() ?? {
      active: ref(''),
      updateActive: (_path: string) => {
      },
    }
  )
}
